<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>

    function f1() {
        console.log('f1()...')
    }

    function f2() {
        console.log('f2()...')
    }

    function f3() {
        console.log('f3()...')
    }

    function f4() {
        console.log('f4()...')
    }

    // 多分支 if-else 语句
    let k = '1'
    if (k === '1') {
        f1()
    } else if (k === '2') {
        f2()
    } else if (k === '3') {
        f3()
    } else {
        f4()
    }

    // switch 语句
    switch (k) {
        case '1' :
            f1();
            break;
        case '2':
            f2();
            break;
        case '3':
            f3();
            break;
        default:
            f4();
    }

    // 使用策略模式   优化代码

    let state = {
        s1: function () {
            f1()
        },
        s2: function () {
            f2()
        },
        s3: function () {
            f3()
        },
        s4: function () {
            f4()
        },
    }
    console.log(state)
    state['s' + k]()
</script>
</body>
</html>
